import React, { Component } from 'react'
import "./index.css"
export default class List extends Component {
    render() {
        const { userData,isFirst,isLoding,err } = this.props
        return (
            <div className="row">
                {
                    isFirst? <h2>Welcome to search message</h2>:
                    isLoding? <h2>Loding.......</h2>:
                    err?<h3>{err}</h3>:
                    userData.map((DataObj) => {
                        return (
                            <div className="card" key={DataObj.id}>
                                <a href={DataObj.html_url} target="_blank" rel="noreferrer">
                                    <img alt="header_img" src={DataObj.avatar_url} style={{ width: "100px" }} />
                                </a>
                                <p className="card-text">{DataObj.login}</p>
                            </div>
                        )
                    })
                }
                {/* <div className="card">
                    <a href="https://github.com/reactjs" target="_blank" rel="noreferrer">
                        <img alt="header_img" src="https://avatars.githubusercontent.com/u/6412038?v=3" style={{ width: "100px" }} />
                    </a>
                    <p className="card-text">reactjs</p>
                </div>
                <div className="card">
                    <a href="https://github.com/reactjs" target="_blank" rel="noreferrer">
                        <img alt="header_img" src="https://avatars.githubusercontent.com/u/6412038?v=3" style={{ width: "100px" }} />
                    </a>
                    <p className="card-text">reactjs</p>
                </div>
                <div className="card">
                    <a href="https://github.com/reactjs" target="_blank" rel="noreferrer">
                        <img alt="header_img" src="https://avatars.githubusercontent.com/u/6412038?v=3" style={{ width: "100px" }} />
                    </a>
                    <p className="card-text">reactjs</p>
                </div>
                <div className="card">
                    <a href="https://github.com/reactjs" target="_blank" rel="noreferrer">
                        <img alt="header_img" src="https://avatars.githubusercontent.com/u/6412038?v=3" style={{ width: "100px" }} />
                    </a>
                    <p className="card-text">reactjs</p>
                </div> */}
            </div>
        )
    }
}
